<template>
    <div>
      <el-card class="box-card">
        <el-form ref="form" :model="resList" label-width="80px">
          <el-row :gutter="10">
            <el-col :span="5">
              <el-form-item label="所属章">
                <el-select v-model="resList.chapterId" placeholder="请选择" :blur="getMySection()">
                  <el-option
                    v-for="item in resChapter"
                    :key="item.id"
                    :label="item.chapterName"
                    :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="5">
              <el-form-item label="所属节">
                <el-select v-model="resList.SectionId" placeholder="请选择">
                  <el-option
                    v-for="item in resSection"
                    :key="item.id"
                    :label="item.nodeName"
                    :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="10">
            <el-col :span="5">
              <el-form-item label="课件类型">
                <el-select v-model="resList.resType" placeholder="请选择" :blur="ifMyType()">
                  <el-option
                    v-for="item in getMytype"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="10">
            <el-col :span="5">
              <el-form-item label="上传视频">
                <el-upload
                  class="upload-demo"
                  :action="'/api/edu-res/res/upload/'"
                  :headers="auth"
                  :show-file-list="false"
                  :on-success="handleAvatarSuccess"
                  multiple>
                  <i class="el-icon-upload"></i>
                  <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
                </el-upload>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="12">
            <el-col :span="6">
              <el-form-item label="排序">
                <el-input-number v-model="resList.sort" :min="1" :max="10" label="描述文字"></el-input-number>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="播放次数">
                <el-input-number v-model="resList.playCount" :min="1" label="描述文字"></el-input-number>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="12">
            <el-col :span="6">
              <el-form-item label="播放时间">
                <el-time-select
                  v-model="resList.playTime"
                  :picker-options="{
                    start: '08:30',
                    step: '00:15',
                    end: '18:30'
                  }"
                  placeholder="选择时间">
                </el-time-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="12">
            <el-col :span="6">
              <el-form-item label="是否免费">
                <el-radio v-model="resList.isEnable" label="1">是</el-radio>
                <el-radio v-model="resList.isEnable" label="0">否</el-radio>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="12">
            <el-col :span="6">
              <el-form-item label="创建人">
                <el-select v-model="resList.createUser" placeholder="请选择">
                  <el-option
                    v-for="item in resTeacher"
                    :key="item.id"
                    :label="item.fullName"
                    :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <div align="center" style="float: right;width: 100%">
            <el-form-item>
              <div>
                <!--<el-button type="primary" @click="savePage">保存</el-button>
                <el-button @click="goback">返回</el-button>-->
              </div>
            </el-form-item>
          </div>

        </el-form>
      </el-card>
    </div>
</template>

<script>
  export default {
    data() {
      return {
        resChapter:[],
        resSection:[],
        resList:{},
        getMytype:[{name:'视频',id:0},{name:'文档',id:1}],
        tosp:false,
        toword:false,
        resTeacher:[],
        auth:{token:null}
      }
    },
    methods: {
      getMychapter:function () { //章节回显下拉框
        this.$http.get("/edu-course/chapter/getMychapter").then((res) => {
          if (res.data.success) {
            this.resChapter = res.data.result
          } else {
            this.$message.error(res.data.message);
          }
        })
      },
      getMySection:function () { //节回显
        if(this.resList.chapterId==null){
          return
        }else{
          this.$http.get("/edu-course/section/getMySection/"+this.resList.chapterId).then((res) => {
            if (res.data.success) {
              this.resSection = res.data.result
            } else {
              this.$message.error(res.data.message);
            }
          })
        }
      },
      ifMyType:function () { //判断上传视频还是文档
        if(this.resList.resType==0){
          this.tosp=true
        }
        if (this.resList.resType==1){
          this.toword=true
        }
      },
      handleAvatarSuccess(res, file) { //上传视频结束后
        this.$message({
          message:file.response.message,
          type: 'success'
        });
      },
      getMyTeacher:function () { //回显老师名称
        this.$http.get("/edu-user/teacher/getMyTeacher").then((res) => {
          if (res.data.success) {
            this.resTeacher = res.data.result;
          } else {
            this.$message.error(res.data.message);
          }
        });
      }
    },
    mounted () {
      this.getMychapter()
      this.getMyTeacher()
      //设置token
      this.auth.token=sessionStorage.getItem("token");
    }
  }
</script>

<style scoped>

</style>
